var larguraTela = window.screen.availWidth-42;
var alturaTela = window.screen.availheight-45;

$(document).ready(function(){
	
	$("body").css({"width":larguraTela});
	
	var posicaoAtual = 0;
	
	var slides = $('.itemperola');
	var titulos = $('.nomeperola');
	
	var quantidadeDeSlides = slides.length;
	
	var slideWidth = 520;
	var slideHeight = 30;
	
	$('.listaperola').css('overflow', 'hidden');
	$('.nomesperolas').css('overflow', 'hidden');
	
	slides.wrapAll('<div id="slideInner"></div>').css({
	    'float' : 'left',
	    'width' : slideWidth
	  });
	titulos.wrapAll('<div id="slideTituloInner"></div>').css({
	    'height' : slideHeight
	  });
	
	$('#slideInner').css('width', slideWidth * quantidadeDeSlides);
	$('#slideTituloInner').css('height', slideHeight * quantidadeDeSlides);
	
	configuraControle(posicaoAtual);
	
	$('.rolar, .rolar2, .rolarnone').bind('click', function(){
	    if($(this).attr('class')=='rolar' || $(this).attr('class')=='rolar2'){
	      posicaoAtual = ($(this).attr('id')=='rightControl')
			? posicaoAtual+1 : posicaoAtual-1;
	    }
	     
	      configuraControle(posicaoAtual);
	     
	      
	      $('#slideInner').animate({
	    	  'marginLeft' : slideWidth*(-posicaoAtual)
	      }, {queue:false,duration:600});
	      
	      $('#slideTituloInner').animate({
	    	  'marginTop' : slideHeight*(-posicaoAtual)
	      }, {queue:false,duration:600});
	  		
      });
	
	function configuraControle(position){
	   
	    if(position==0){ 
	    	$('#leftControl').css({"opacity":"0.5"});
	    	$('#leftControl').attr("class","rolarnone");
	    }
	    else{ 
	    	$('#leftControl').css("opacity","1");
	    	$('#leftControl').attr("class","rolar");
	    }
	    if(position==quantidadeDeSlides-1){ 
	    	$('#rightControl').css("opacity","0.5");
	    	$('#rightControl').attr("class","rolarnone");
	    }
	    else{ 
	    	$('#rightControl').css("opacity","1");
	    	$('#rightControl').attr("class","rolar2");
	    }
		
	}
	
	$(document).keydown(function(event) {
		
		if ($('.central').is(':hover')){
			$("body").css("overflow","hidden");
			if(event.which == 35){
				while(posicaoAtual < quantidadeDeSlides-1){
					$(".rolar2").click();
				}
			}
			if(event.which == 36){
				while(posicaoAtual > 0){
					$(".rolar").click();
				}
			}
			if ( event.which == 37) {
				$(".rolar").click();
			}
			if ( event.which == 39) {
				$(".rolar2").click();
			}
		}
		$("body").css("overflow","visible");
	});
});
